<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        // 数组遍历方法（map）
        // Array.prototype.map()
        // var new_array = arr.map(function callback(currentValue[, index[, array]]) {
        //     // Return element for new_array 
        // }[, thisArg])


        // 参数1： callback
        // callback生成新数组元素的函数， 使用三个参数：
        // currentValue callback数组中正在处理的当前元素。
        // index可选callback 数组中正在处理的当前元素的索引。
        // array可选map 方法调用的数组。

        // 参数2： thisArg
        // thisArg可选执行 callback 函数时值被用作this。

        // 返回值：
        // 回调函数的结果组成新数组的每一个元素

        // 注意：● map 不修改调用它的原数组本身（ 当然可以在 callback 执行时改变原数组）
        // ● 因为map生成一个新数组， 当你不打算使用返回的新数组却使用map是违背设计初衷的， 请用forEach或者for - of替代。 
        // 你不该使用map: A) 你不打算使用返回的新数组， 或 / 且 B) 你没有从回调函数中返回值。


        // 以下代码使用一个包含对象的数组来重新创建一个格式化后的数组。
        // var kvArray = [{
        //     key: 1,
        //     value: 10
        // }, {
        //     key: 2,
        //     value: 20
        // }, {
        //     key: 3,
        //     value: 30
        // }]
        // var refor = kvArray.map(obj => {
        //     var oObj = {}
        //     oObj[obj.key] = obj.value;
        //     return oObj
        // })
        // console.log(refor);






        // reformattedArray 数组为： [{1: 10}, {2: 20}, {3: 30}], 

        // kvArray 数组未被修改: 
        // [{key: 1, value: 10}, 
        //  {key: 2, value: 20}, 
        //  {key: 3, value: 30}]
    </script>
</body>

</html>